$(function () {
    var form = layui.form

    // <-----------------------------------增！-->
    // 加载链接信息
    function loadLinksInfo() {
        $.ajax({
            url: 'admin/links',
            success: function (res) {
                var tags = template('table-tpl', res);
                $('.layui-table tbody').html(tags);
            }
        })
    }
    loadLinksInfo()


    // <-----------------------------------删除！-->
    // 删除按钮
    $('.layui-table tbody').on('click', '.delete', function (e) {
        let id = $(e.target).data('id');
        layer.confirm('删除就完事了', function (i) {
            $.ajax({
                type: 'delete',
                url: 'admin/links/' + id,
                success: function (res) {
                    if (res.status === 0) {
                        layer.close(i); //再执行关闭
                        loadLinksInfo()
                    }
                }
            })

        })
    })

    // <-----------------------------------添加！-->
    $('#add-link').click(function () {
        var index = layer.open({
            type: 1,
            title: '添加友商链接',
            content: $('#add-form-tpl').html(),
            area: ['500px', '500px']
        })
        // 上传
        $('#urlIcon').click(function () {
            $('#linkFile').click()
        })
        $('#linkFile').change(function (e) {
            var objectURL = URL.createObjectURL(e.target.files[0])

            $('#preIcon').attr('src', objectURL)
        })

        // 提交
        $('#add-form').submit(function (e) {
            e.preventDefault()
            var fd = new FormData(this);
            $.ajax({
                type: 'post',
                url: 'admin/links',
                data: fd,
                processData: false,
                contentType: false,
                success: function (res) {
                    if (res.status === 0) {
                        layer.close(index)
                        loadLinksInfo()
                    }
                }
            })
        })
    })


 $('.layui-table tbody').on('click', '.edit', function (e) {
    var id = $(e.target).data('id')
    // 获取链接数据
    $.ajax({
      type: 'get',
      url: 'admin/links/' + id,
      success: function (res) {
        var index = layer.open({
          type: 1,
          title: '编辑友情链接',
          content: $('#edit-form-tpl').html(),
          area: ['500px', '350px']
        })
        // 设置预览图片效果
        $('#preIcon').attr('src', 'http://localhost:8888/uploads/' + res.data.linkicon)
        // 初始化表单数据
        delete res.data.linkicon
        form.val('editForm', res.data)
        
        // 绑定文件上传按钮点击事件
        $('#urlIcon').click(function () {
          $('#linkFile').click()
        })
        // 监听文件选中事件
        let file = null
        $('#linkFile').change(function (e) {
          const objectURL = URL.createObjectURL(e.target.files[0])
          file = e.target.files[0]
          $('#preIcon').attr('src', objectURL)
        })

        // 绑定表单提交事件
        $('#edit-form').submit(function (e) {
          e.preventDefault()
          var fd = new FormData(this)
          if (file) {
            fd.append('linkicon', file)
          }
          $.ajax({
            type: 'put',
            url: 'admin/links/' + id,
            data: fd,
            processData: false,
            contentType: false,
            success: function (res) {
              if (res.status === 0) {
                // 编辑成功
                layer.close(index)
                loadLinksInfo()
              }
            }
          })
        })
      }
    })
  })



// ///////////////////////////////////////////////////////编辑、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、
$('.layui-table tbody').on('click', '.edit', function (e) {
    var id = $(e.target).data('id')
    // 获取链接数据
    $.ajax({
      type: 'get',
      url: 'admin/links/' + id,
      success: function (res) {
        var index = layer.open({
          type: 1,
          title: '编辑友情链接',
          content: $('#edit-form-tpl').html(),
          area: ['500px', '350px']
        })
        // 初始化表单
        delete res.data.linkicon
        form.val('editForm', res.data)
        // 文件按钮
        $('#urlIcon').click(function () {
          $('#linkFile').click()
        })
        let file = null
        $('#linkFile').change(function (e) {
          const objectURL = URL.createObjectURL(e.target.files[0])
          file = e.target.files[0]
          $('#preIcon').attr('src', objectURL)
        })
        // 提交
        $('#edit-form').submit(function (e) {
          e.preventDefault()
          var fd = new FormData(this)
          if (file) {
            fd.append('linkicon', file)
          }
          $.ajax({
            type: 'put',
            url: 'admin/links/' + id,
            data: fd,
            processData: false,
            contentType: false,
            success: function (res) {
              if (res.status === 0) {
                layer.close(index)
                loadLinksInfo()
              }
            }
          })
        })
      }
    })
  })


});
